<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>CKEditor 5 – balloon editor build – development sample</title>
	<style>
		body {
			max-width: 800px;
			margin: 20px auto;
		}
	</style>
</head>
<body>

<h1>CKEditor 5 – balloon editor build – development sample</h1>

<div id="editor">
	<h2>Sample</h2>

	<p>This is an instance of the <a href="https://docs.ckeditor.com/ckeditor5/latest/builds/guides/overview.html#balloon-editor">balloon editor build</a>.</p>

	<figure class="image">
		<img src="../tests/manual/sample.jpg" alt="Autumn fields" />
	</figure>

	<p>You can use this sample to validate whether your <a href="https://docs.ckeditor.com/ckeditor5/latest/builds/guides/development/custom-builds.html">custom build</a> works fine.</p>
</div>

<script src="../build/ckeditor.js"></script>
<script>
	BalloonEditor.create( document.querySelector( '#editor' ) )
		.then( editor => {
			window.editor = editor;
		} )
		.catch( err => {
			console.error( err.stack );
		} );
</script>

</body>
</html>
